<template>
  <div class="xiaoxi">
    <!-- 头部 -->
    <van-nav-bar
      title="消息"
      left-text="返回"
      left-arrow
      @click-left="onClickLeft"
    />
    <!-- 消息区域 -->
  <van-collapse v-model="xxactive">
  <van-collapse-item :name="i" v-for="(item,i) of xx" :key="i">
    <template #title>
      <div>消息{{i+1}} <van-icon name="chat-o" color="#1989fa" dot /></div>
    </template>
    {{item.nr}}
  </van-collapse-item>
</van-collapse>
  </div>
</template>
<script>
export default {
  data() {
    return {
      xxactive:['1'],
      xx:[
        {nr:"你爸爸叫你回家吃饭"},
        {nr:"今天是个好日子?"},
        {nr:"记得今天是什么日子?"},
        {nr:"今天做好饭了"},
        {nr:"开心点"},
        {nr:"在外多照顾身体"},
        {nr:"多穿点衣服"},
        {nr:"多喝热水"},
        {nr:"今天的粥不错"},
      ],

    };
  },
  methods: {
    // 返回按钮
    onClickLeft() {
      this.$router.push("/wode");
    },
    // 这是按钮的
    
  },
};
</script>
<style>
</style>